#set(String title = "Alice | Login Page")

#tag layout_block("css_page_level")
<link href="${CONTEXT_PATH}/assets/global/plugins/font-awesome/css/font-awesome.min.css" rel="stylesheet" type="text/css"/>
<link href="${CONTEXT_PATH}/assets/global/plugins/simple-line-icons/simple-line-icons.min.css" rel="stylesheet" type="text/css"/>
<link href="${CONTEXT_PATH}/assets/global/plugins/bootstrap/css/bootstrap.min.css" rel="stylesheet" type="text/css"/>
<link href="${CONTEXT_PATH}/assets/global/plugins/uniform/css/uniform.default.css" rel="stylesheet" type="text/css"/>
<!-- BEGIN THEME STYLES -->
<link href="${CONTEXT_PATH}/assets/global/css/components-md.css" id="style_components" rel="stylesheet" type="text/css"/>
<link href="${CONTEXT_PATH}/assets/global/css/plugins-md.css" rel="stylesheet" type="text/css"/>
<link href="${CONTEXT_PATH}/assets/admin/layout/css/layout.css" rel="stylesheet" type="text/css"/>
<link href="${CONTEXT_PATH}/assets/admin/layout/css/themes/darkblue.css" rel="stylesheet" type="text/css"/>
<link href="${CONTEXT_PATH}/assets/admin/layout/css/custom.css" rel="stylesheet" type="text/css"/>
<!-- END THEME STYLES -->
<link href="${CONTEXT_PATH}/assets/global/plugins/select2/select2.css" rel="stylesheet" type="text/css"/>
<link href="${CONTEXT_PATH}/assets/admin/pages/css/login-soft.css" rel="stylesheet" type="text/css"/>
#end

#tag layout_block("js_page_level")
<script src="${CONTEXT_PATH}/assets/global/plugins/jquery.min.js" type="text/javascript"></script>
<script src="${CONTEXT_PATH}/assets/global/plugins/jquery-migrate.min.js" type="text/javascript"></script>
<script src="${CONTEXT_PATH}/assets/global/plugins/bootstrap/js/bootstrap.min.js" type="text/javascript"></script>
<script src="${CONTEXT_PATH}/assets/global/plugins/jquery.blockui.min.js" type="text/javascript"></script>
<script src="${CONTEXT_PATH}/assets/global/plugins/uniform/jquery.uniform.min.js" type="text/javascript"></script>
<script src="${CONTEXT_PATH}/assets/global/plugins/jquery.cokie.min.js" type="text/javascript"></script>
<!--[if lt IE 9]>
<script src="${CONTEXT_PATH}/assets/global/plugins/respond.min.js"></script>
<script src="${CONTEXT_PATH}/assets/global/plugins/excanvas.min.js"></script>
<![endif]-->
<script src="${CONTEXT_PATH}/assets/global/plugins/jquery-validation/js/jquery.validate.min.js" type="text/javascript"></script>
<script src="${CONTEXT_PATH}/assets/global/plugins/backstretch/jquery.backstretch.min.js" type="text/javascript"></script>
<script src="${CONTEXT_PATH}/assets/global/plugins/select2/select2.min.js" type="text/javascript"></script>
<script src="${CONTEXT_PATH}/assets/global/scripts/metronic.js" type="text/javascript"></script>
<script src="${CONTEXT_PATH}/assets/admin/layout/scripts/layout.js" type="text/javascript"></script>
<script src="${CONTEXT_PATH}/assets/admin/pages/scripts/login.js" type="text/javascript"></script>
<script src="${CONTEXT_PATH}/assets/global/scripts/validateimg.js" type="text/javascript"></script>

<script src="${CONTEXT_PATH}/assets/global/scripts/rsa/RSA.js" type="text/javascript"></script>
<script src="${CONTEXT_PATH}/assets/global/scripts/rsa/BigInt.js" type="text/javascript"></script>
<script src="${CONTEXT_PATH}/assets/global/scripts/rsa/Barrett.js" type="text/javascript"></script>
#end

#tag layout_block("container")
<!-- BEGIN LOGO -->
<div class="logo">
</div>

<!-- END LOGO -->

<!-- BEGIN LOGIN -->
<div class="content">
    <!-- BEGIN LOGIN FORM -->
    <form class="login-form" action="doLogin" method="post">
        <h3 class="form-title">${getMessage('net.mayee.alice.login.msg.welcome')}</h3>
        #if(shiroLoginFailure != null)
        <div class="alert alert-danger">
            <button class="close" data-close="alert"></button>
            <span>${shiroLoginFailure}</span>
        </div>
        #end
        #if(ERR_BROWSER != null)
        <div class="alert alert-danger">
            <button class="close" data-close="alert"></button>
            <span>${ERR_BROWSER}</span>
        </div>
        #end
        #if(ERR_MOBILE != null)
        <div class="alert alert-danger">
            <button class="close" data-close="alert"></button>
            <span>${ERR_MOBILE}</span>
        </div>
        #end
        <div class="form-group">
            <label class="control-label visible-ie8 visible-ie9">${getMessage('net.mayee.alice.login.username')}</label>
            <div class="input-icon">
                <i class="fa fa-user"></i>
                <input class="form-control placeholder-no-fix" type="text" autocomplete="off" placeholder="${getMessage('net.mayee.alice.login.username')}" value="${username}" name="username"/>
            </div>
        </div>
        <div class="form-group">
            <label class="control-label visible-ie8 visible-ie9">${getMessage('net.mayee.alice.login.password')}</label>
            <div class="input-icon">
                <i class="fa fa-lock"></i>
                <input class="form-control placeholder-no-fix" type="password" autocomplete="off" placeholder="${getMessage('net.mayee.alice.login.password')}" name="password" id="password"/>
            </div>
        </div>
        <div class="form-group">
            <label class="control-label visible-ie8 visible-ie9">${getMessage('net.mayee.alice.login.validate_img')}</label>
            <div class="input-icon">
                <i class="fa fa-align-justify" id="vi_icon"></i>
                <input id="vi_text" class="form-control placeholder-no-fix" maxlength="5"
                        type="text" autocomplete="off" placeholder="${getMessage('net.mayee.alice.login.validate_img')}" name="vi_code"/>
            </div>
        </div>
        <div class="form-group">
            <div class="input-icon">
                <span id="vi_load" style="height:34px;line-height:34px;display: none;color: #FFFFFF;">${getMessage('net.mayee.alice.login.loading')}</span><img id="vi_img" src=""/>
            </div>
        </div>
        <div class="form-actions">
            #if((props("system.forget.password.open")).asBoolean())
            <label class="checkbox"><a href="javascript:;" id="forget-password">${getMessage('net.mayee.alice.login.forget_password')}</a></label>
            #end
            #if(ERR_BROWSER == null && ERR_MOBILE == null)
            <button type="submit" class="btn blue pull-right">
                ${getMessage('net.mayee.alice.login.btn.login')} <i class="m-icon-swapright m-icon-white"></i>
            </button>
            #end
        </div>
    </form>
    <input type="hidden" id="rsa_m" value="${rsa_modulus}">
    <input type="hidden" id="rsa_e" value="${rsa_exponent}">
    <!-- END LOGIN FORM -->
    <!-- BEGIN FORGOT PASSWORD FORM -->
    <form class="forget-form" action="index.html" method="post">
        <h3>${getMessage('net.mayee.alice.login.forget_password')}</h3>
        <p>
            ${getMessage('net.mayee.alice.login.forget_password')}
        </p>
        <div class="alert alert-danger " >
            <button class="close" data-close="alert"></button>
            <span>目前无法通过邮箱找回密码！</span>
        </div>
        <div class="form-group">
            <div class="input-icon">
                <i class="fa fa-envelope"></i>
                <input class="form-control placeholder-no-fix" type="text" autocomplete="off" placeholder="${getMessage('net.mayee.alice.login.email')}" name="email"/>
            </div>
        </div>
        <div class="form-actions">
            <button type="button" id="back-btn" class="btn">
                <i class="m-icon-swapleft"></i> ${getMessage('net.mayee.alice.login.btn.cancel')} </button>
            <!--<button type="submit" class="btn blue pull-right">-->
                <!--${getMessage('net.mayee.alice.login.btn.confirm')} <i class="m-icon-swapright m-icon-white"></i>-->
            <!--</button>-->
        </div>
    </form>
    <!-- END FORGOT PASSWORD FORM -->
</div>
<!-- END LOGIN -->
#end

#tag layout_block("script")
<script>
    jQuery(document).ready(function () {
        Metronic.init();
        Layout.init();
        Login.init();
        ValidateImg.init('${CONTEXT_PATH}/');
        $.backstretch([
            "${CONTEXT_PATH}/assets/admin/pages/media/bg/1.jpg",
            "${CONTEXT_PATH}/assets/admin/pages/media/bg/2.jpg",
            "${CONTEXT_PATH}/assets/admin/pages/media/bg/3.jpg",
            "${CONTEXT_PATH}/assets/admin/pages/media/bg/4.jpg"
        ], {
            fade: 1000,
            duration: 5000
        });
    });

</script>
#end

#include ("/layout/layout_login.html")
